<template>
   <mu-flexbox-item>
        <span class="icon-wrap"><i class="iconfont" :class="'icon-'+icon"></i></span>
        <span class="sub-title">{{subtitle}}</span>
    </mu-flexbox-item>
</template>
<script>
export default {
  name: 'sub-menu-button',
  props: ['icon', 'subtitle']
}
</script>

 <style lang="less">
 @import '../common/css/vars.less';
.sub-menu {
  .icon-wrap {
    text-align: center;
  }
  .sub-title {
    text-align: center;
    display: block;
  }
  .iconfont {
    display: block;
    font-size: 24px;
    color: @color-primary;
  }

}
</style>
